<template>
  <el-container class="main_con" style="padding-bottom: 0px">
    <ufrom @submit="saveData" ref="ufrom">
      <el-form size="medium" label-width="120px" ref="itemForm" :model="obj" :rules="itemRules">
        <div class="setting_body_item">
          <div class="header">激活</div>
          <div class="conetnt edit_con">
            <div class="edit_content">
              <el-form-item label="激活状态">
                <el-button v-if="!obj.token" size="medium" type="text" @click="bfactive">激活</el-button>
                <span v-else>已激活</span>
              </el-form-item>
            </div>
          </div>
        </div>
        <div class="setting_body_item" v-if="obj.token">
          <div class="header">版权设置</div>
          <div class="conetnt edit_con">
            <div class="edit_content">
              <el-form-item label="网站名称" prop="name"><el-input v-model="obj.name" style="width: 300px"></el-input></el-form-item>
              <el-form-item label="网站logo" prop="logo">
                <div style="width: 100px; height: 100px"><Upload :tempUrl="obj.logo" @input="getImage($event, 'logo')"></Upload></div>
                <div style="color: #909399; font-size: 12px">图片为正方形，建议尺寸800*800，用于商城首页分享的系统默认宣传图</div>
              </el-form-item>
              <el-form-item label="联系方式" prop="mobile"><el-input v-model="obj.mobile" style="width: 300px"></el-input></el-form-item>

              <el-form-item label="移动端版权跳转">
                <!--   <el-input disabled v-model="obj.link_info.link" placeholder="请选择链接地址" style="width:360px;">
                    <template slot="append">
                      <span @click="selectlink">选择链接</span>
                    </template>
                  </el-input> -->
                <div class="" style="width: 300px;" @click="selectlink"><Linkdiv :linkdata="obj.link_info"></Linkdiv></div>
              </el-form-item>
              <el-form-item label="ICP备案号" prop="record_number"><el-input v-model="obj.record_number" style="width: 300px"></el-input></el-form-item>
              <el-form-item label="公安备案号"><el-input v-model="obj.record_number1" style="width: 300px"></el-input></el-form-item>
            </div>
          </div>
        </div>
      </el-form>
    </ufrom>
    <el-dialog :visible.sync="drawer">
      <div class="dialog_div">
        <img src="@/assets/images/shenhe.png" />
        <el-form label-width="60px">
          <el-form-item label="激活码"><el-input type="textarea" :rows="2" style="width: 500px;" placeholder="请输入激活码" v-model="licensetext"></el-input></el-form-item>
        </el-form>
        <el-button @click="activecopyright">确定激活</el-button>
      </div>
    </el-dialog>
    <el-dialog class="selectlink" title="链接选择器" :visible.sync="drawer1" destroy-on-close width="800px">
      <SelectLink ref="selectlink" :linktype="linktype" :linkdata="linkdata" @changelink="changelink"></SelectLink>
    </el-dialog>
  </el-container>
</template>

<script>
import Upload from '@/components/Upload/SingleImage2';
import {getcopyright, copyrightactive, editcopyright} from '@/api/mall/copyright';
import SelectLink from '@/components/SelectLink/index';
import Linkdiv from '@/components/Link/index';
export default {
  data() {
    return {
      isLoading: false,
      iconshow: false,
      showSelect: false,
      selectMer: [],
      rk: 1,
      obj: {
        name: '',
        mobile: '',
        logo: '',
        record_number: '',
        token: null
      },
      drawer: false,
      drawer1: false,
      linkdata: {
        linkdata: {}
      },
      linktype: ['6'],
      licensetext: '',
      itemRules: {
        name: [
          {
            required: true,
            message: '网站名称必须填写'
          }
        ],
        logo: [
          {
            required: true,
            message: 'logo必须上传'
          }
        ],
        mobile: [
          {
            required: true,
            message: '联系方式必填'
          }
        ],
        record_number: [
          {
            required: true,
            message: '备案号必填'
          }
        ]
      }
    };
  },
  components: {
    Upload,
    SelectLink,
    Linkdiv
  },
  mounted() {
    this.getdata();
  },
  methods: {
    //选择链接
    selectlink() {
      this.drawer1 = true;
      this.$nextTick(() => {
        this.$refs.selectlink.init(this.linkdata);
      });
    },
    changelink(data) {
      this.obj.link_info = data;

      this.linkdata.linkdata = data;

      this.drawer1 = false;
    },
    bfactive() {
      this.licensetext = '';
      this.drawer = true;
    },
    activecopyright() {
      let data = {
        license: this.licensetext
      };
      copyrightactive(data).then(res => {
        this.drawer = false;
        this.getdata();
      });
    },
    getdata() {
      let data = {};
      getcopyright(data).then(res => {
        if (res.msg) {
          let obj = res.msg;
          if (obj.link_info) {
            obj.link_info = JSON.parse(obj.link_info);
            this.linkdata.linkdata = obj.link_info;
          }

          this.obj = obj;
        }
      });
    },

    //获取图片
    getImage(val, tag) {
      this.obj.logo = val;
    },

    //保存数据
    saveData() {
      this.$refs.itemForm.validate(valid => {
        if (valid) {
          let data = {
            name: this.obj.name,
            mobile: this.obj.mobile,
            logo: this.obj.logo,
            record_number: this.obj.record_number,
            record_number1: this.obj.record_number1,
            link_info: JSON.stringify(this.obj.link_info)
          };
          editcopyright(data)
            .then(res => {
              this.getdata();
              this.$refs.ufrom.init();
            })
            .catch(e => {
              this.$refs.ufrom.init();
            });
        } else {
          this.$refs.ufrom.init();
          //校验没通过
          return false;
        }
      });
    },
    closePro() {
      this.showSelect = false;
    }
  }
};
</script>
